<!-- 添加教育经历 -->
<template>
	<view>
		<view class="page">
			<u-form :model="form" ref="uForm">
				<u-form-item label="学校">
					<u-input v-model="form.schoolName" placeholder="请输入学校" />
				</u-form-item>
				<u-form-item label="学历">
					<u-input v-model="schoolType" vale="" type="select" placeholder="请选择" :select-open="show" disabled
						@click="show = true" />
				</u-form-item>
				<u-form-item label="专业">
					<u-input v-model="form.schoolSpecialty" passwordIcon="请输入专业" />
				</u-form-item>
				<u-form-item label="时间">
					<view class="picker">
						<view class="pickeritem flex justify-between">
							<picker mode="date" :value="stdt" :start="start" @change="bindDateChange1">{{stdt}}</picker>
							-
							<picker mode="date" :value="eddt" :end="end" @change="bindDateChange2">{{eddt}}</picker>
						</view>
					</view>
				</u-form-item>
			</u-form>

			<u-select @confirm="compile" v-model="show" :list="education"></u-select>
		</view>

		<view class=" btn">
			<view class="button0 flex justify-center align-center" @click="del">删除</view>
			<view class="button flex justify-center align-center" @click="submit">修改</view>
		</view>
	</view>
</template>

<script>
	import {
		education
	} from '@/data/my.js'
	export default {

		data() {
			const currentDate = this.getDate({
				format: true
			})
			return {
				form: {
					schoolName: '',
					schoolType: '',
					schoolSpecialty: '',
					startDat: '',
					endDate: ''
				},
				stdt: currentDate,
				eddt: currentDate,
				start: '',
				end: '',
				schoolType: '',
				show: false,
				education,
				deleteQurey: {
					id: ''
				}
			}
		},
		computed: {
			start() {
				return this.getDate('start');
			},
			end() {
				return this.getDate('end');
			}
		},
		onLoad(e) {
			let item = JSON.parse(e.item)
			console.log(e)
			this.form = item
			this.deleteQurey.id = item.educationExperienceId
		},
		methods: {
			//选择学历
			compile(e) {
				console.log(e)
				this.schoolType = e[0].label
				this.form.schoolType = e[0].value
			},
			//提交表单
			async submit() {
				this.form.startDate = this.stdt
				this.form.endDate = this.eddt
				await this.$put('/userResumeEducationExperience/save', this.form)
				await uni.navigateBack({
					delta: 1
				})
			},
			async del() {
				await this.$remove('/userResumeEducationExperience/remove', this.deleteQurey)
				await uni.navigateBack({
					delta: 1
				})
			},
			bindDateChange1(e) {
				this.stdt = e.target.value
			},
			bindDateChange2(e) {
				this.eddt = e.target.value
			},
			getDate(type) {
				const date = new Date();
				let year = date.getFullYear();
				let month = date.getMonth() + 1;
				let day = date.getDate();
				let hour = date.getHours();

				if (type === 'start') {
					year = year - 60;
				} else if (type === 'end') {
					year = year + 2;
				}
				month = month > 9 ? month : '0' + month;
				day = day > 9 ? day : '0' + day;
				return `${year}-${month}-${day}`;
			},
		},
		onReady() {
			this.$refs.uForm.setRules(this.rules);
		}
	}
</script>

<style lang="scss">
	.page {
		padding: 20rpx;
	}
	.btn {
			background: #FFFFFF;
			position: fixed;
			bottom: calc(20rpx + env(safe-area-inset-bottom));
			left: 0;
			padding: 20rpx 30rpx 0;
			display: flex;
			width: 100%;
			justify-content: space-between;
			.button0 {
				width: 300rpx;
				height: 75rpx;
				background: #999999;
				border-radius: 38rpx;
				line-height: 1;
				font-weight: 500;
				color: #FFFFFF;
				font-size: 32rpx;
				box-shadow: 0rpx 10rpx 10rpx rgba(153, 153, 153, 0.4);
			}

			.button {
				width: 300rpx;
				height: 75rpx;
				background: #0265EB;
				border-radius: 38rpx;
				line-height: 1;
				font-weight: 500;
				color: #FFFFFF;
				font-size: 32rpx;
				box-shadow: 0rpx 10rpx 10rpx rgba(12,108,240, .4);
			}
		}
</style>
